import React from 'react';
import {
    HashRouter,
    Switch,
    Route,
    Link
} from 'react-router-dom';

import "antd/dist/antd.css";
import { Layout, Menu } from 'antd';
import { PieChartOutlined } from '@ant-design/icons';

import Student from './Student';
import Teacher from './Teacher';
import Teaching from './Teaching';

const { Header, Sider, Content } = Layout;

class Home extends React.Component {
    render() {
        return (
            <HashRouter>
                <div>
                    <Layout>
                        <Header>
                            <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']}


                            >
                                <Menu.Item key="1">关于</Menu.Item>
                                <Menu.Item key="2">nav 2</Menu.Item>
                                <Menu.Item key="3">nav 3</Menu.Item>
                            </Menu>
                        </Header>
                        <Layout>
                            <Sider width={190}>
                                <Menu theme="dark" defaultSelectedKeys={['1']} mode="inline">
                                    <Menu.Item key="1" icon={<PieChartOutlined />}>
                                        <Link to="/">学生管理</Link>
                                    </Menu.Item>
                                    <Menu.Item key="2" icon={<PieChartOutlined />}>
                                        <Link to="/teacher">讲师管理</Link>
                                    </Menu.Item>
                                    <Menu.Item key="3" icon={<PieChartOutlined />}>
                                        <Link to="/teaching">助教管理</Link>
                                    </Menu.Item>
                                </Menu>
                            </Sider>
                            <Content >
                                <Switch>
                                    <Route path="/teacher" component={Teacher}></Route>
                                    <Route path="/teaching" component={Teaching}></Route>
                                    <Route path="/" component={Student}></Route>
                                </Switch>
                            </Content>
                        </Layout>
                    </Layout>
                </div>
                <div>

                </div>
            </HashRouter>

        )
    }
}

export default Home;